<template>
  <el-card class="content small-padding-card">
    <top-label v-model="index" class="move-up">
      <span :slot="0">雨量分析</span>
      <span :slot="1">数据统计</span>
    </top-label>

    <single-point-analysis
      v-if="index === 0"
      :node="node"
    ></single-point-analysis>
    <data-statistics v-if="index === 1" :node="node"></data-statistics>

  </el-card>
</template>

<script>
import TopLabel from "~/components/TopLabel";
import SinglePointAnalysis
  from "~/views/monitor-control/statistical-analysis/rainfall/SinglePointAnalysis";
import DataStatistics from "~/views/monitor-control/statistical-analysis/rainfall/DataStatistics";

export default {
  name: "SurfaceDisplacement",
  components: { DataStatistics, SinglePointAnalysis, TopLabel },
  props: {
    node: Object
  },
  data () {
    return {
      index: 0
    }
  },
  created() {
    if (window.sessionStorage.getItem("indexra") != null) {
      this.index =Number(window.sessionStorage.getItem("indexra"));
    }
  },
  watch: {
    index: function (indexra, oldVal) {
     window.sessionStorage.setItem("indexra", indexra);
      // console.log(val);
    },
  },
}
</script>

<style scoped>
.content {
  margin-left: 10px;
  padding-top: 5px;
}
.move-up {
  transform: translateY(-5px);
}
</style>
